<template>
    <!--头部-->
    <div class="h_header" >
        <div class="h_top">
            <div style="width: 500px;float: left;color: white;margin-left: 100px;margin-top: 5px;">
                <marquee>
                    {{notice}}
                </marquee>
            </div>
            <div class="h_top_body">
                <ul class="top_list clearfix" >
                <!--<li><a href="/recruit" v-if="this.loginType== 0 && flag===false">入驻商家</a></li>-->
                    <li @click="shangjia"><a v-if="this.loginType===0">入驻商家</a></li>
                    <li @click="shop"><a v-if="this.loginType===0">申请店铺</a></li>
<!--                    <li><a href="/recruit" v-if="this.$istype111===-1">入驻商家</a></li>-->
<!--                    <li><a href="/recruit1" v-if="this.$istype111===1">申请店铺</a></li>-->
                    <li class="">
                        <router-link :to="{path: '/geRenCenter'}" v-if="this.loginType===0">个人中心</router-link>
                    </li>
                    <li class="">
                        <router-link :to="{path: '/business'}" v-if="this.loginType=== 1">我的店铺</router-link>
                    </li>
                    <li class="">
                        <router-link :to="{path: '/myorder'}" v-if="this.loginType===0">我的订单</router-link>
                    </li>
                    <li class="">
                        <router-link :to="{path: '/myCart'}" v-if="this.loginType===0">我的购物车</router-link>
                    </li>
                   <!-- <li class="s_left">
                        <router-link :to="{path: '/geRenCenter'}" v-if="this.loginType!=null">{{userInfo}}</router-link>
                    </li>-->
                    <li><a @click="tuichu" v-if="this.loginType=== 0|| this.loginType===1">退出</a></li>
                </ul>
                <ul class="top_list clearfix" >
                    <li class="s_left"><a href="javascript:" @click="login" v-if="this.loginType===-1">登录</a></li>
                    <li><a href="javascript:" @click="register" v-if="this.loginType===-1">注册</a></li>
                </ul>
            </div>
        </div>
        <div style="float: left;margin-left: 120px;margin-top: 10px">
            <a>
                <img src="@/assets/image/AAAlogo.jpg" alt="" style="margin-top: 20px">
            </a>
        </div>
        <div class="h_nav">

            <ul class="h_nav_ul clearfix" >
                <li v-for="(item, index) in navList" :key="index">
                    <router-link :class="{active: isNow === item.href}" :to="item.href" target="_self">{{item.headName}}</router-link>
                    <a :href="item.href" v-if="item.headId==6">{{item.headName}}</a>
                    <router-link tag="a" target="_blank" :to="item.href" v-if="item.skipWay==0">{{item.headName}}</router-link>
                </li>
            </ul>
            <div style="float: right;margin-top: 30px"  >
                <el-input placeholder="请输入菜品名" v-model="name" v-on:keyup.enter.native="searchJIangshi" class="input-with-select">
                    <el-button v-on:click="searchJIangshi" slot="append" icon="el-icon-search"></el-button>

                </el-input>
            </div>
        </div>
<!--        <el-button plain @click="open1">可自动关闭</el-button>-->
    </div>
</template>
<script>

    export default {
        name: "app-header",
        props: {
            active: {
                type: String
            },
            hideTop: {
                type: Boolean
            },
            hideSearch: {
                type: Boolean
            },
        },
        data () {
            return {
                name:this.$route.params.name,
                teacherId:"",
                isTeacher:'',
                userInfo:'',
                webInfo:true,
                num: 0,
                interval: null,
                navList:[],
                isNow:'',
                prefecture:[],
                loginType:-1,
                loginType1:-1,
                token:"",
                flag:"false",
                notice:"",
                messages1:"",
                messages2:"",
                a:0,
                href1:"",
                href2:"",
            }
        },
        created () {
            var that=this;
            this.name=""
            this.$http.get("/firstpage/api/headnav/getAllHeadNav").then(function (resp) {
                that.token = localStorage.getItem('token');
                console.log(that.token)
                that.navList=resp.data.data;
            })
            if(this.token!=null&& this.a===0){
                this.a=1
                this.$http.post("/business/business/getIsType").then(resp => {
                    if(resp.data.code===200){
                        that.messages1="欢迎使用菜菜帮"
                        that.open1()
                        this.loginType = resp.data.data;
                    }else{
                        this.loginType =-1
                    }
                });
                //获取商家入驻的审核情况
                if (this.$root.istype111===0){
                    this.$http.post("/business/checkBusiness/getCheckBusinessState").then(function (resp) {
                        console.log(resp)
                        if (resp.data.code===200){
                            that.messages2=resp.data.data.content
                            if (resp.data.data.state===1){
                                that.open2()
                                this.$root.istype111=1;
                            }else if(resp.data.data.state===2){
                                that.open3()
                                this.$root.istype111=-1;
                                console.log("+=========+");
                                console.log(that.$istype111)
                            }else{
                                that.messages2="您提交的商家入驻申请还在审核中，请耐心等待！！！感谢您的谅解"
                                that.open2()
                                this.$root.istype111=0;
                            }
                        }
                    });
                }
                //如果商家入驻的审核通过，获取商家申请店铺的审核情况
                if (this.$root.istype111===-1){
                    this.$http.post("shop/api/checkshop/findMyCheck").then(function (resp) {
                        console.log(resp)
                        if (resp.data.code===2000){
                            that.messages2=resp.data.data.content
                            if (resp.data.data.state===1){
                                that.open2()
                                this.$root.istype111=3;
                            }else if(resp.data.data.state===2){
                                that.open3()
                                this.$root.istype111=1;
                            }else{
                                that.messages2="您提交的店铺申请申请还在审核中，请耐心等待！！！感谢您的谅解"
                                that.open2()
                                this.$root.istype111=2;
                            }
                        }
                    });
                }
            }
            this.$http.get("/firstpage/api/notice/getNotice").then(resp=>{
                for (let i = 0; i < resp.data.data.length; i++) {
                    this.notice += "公告:"+resp.data.data[i].notice+"         "
                }
            })
        },
        mounted(){
            this.token=window.localStorage.getItem("token");
        },
        methods: {
            shangjia(){
                var that = this;
                if (that.$root.istype111===0){
                    that.$message.success("您提交的商家入驻还在审核，请勿重复提交");
                }
                if (this.$root.istype111===-1){
                    that.$router.push("/recruit");
                }
                if (this.$root.istype111===1){
                    that.$message.success("您提交的商家入驻审核已通过，可以前往申请店铺");
                }
            },
            shop(){
                var that = this;
                console.log("+++++++======");
                console.log(this.$root.istype111);
                if (this.$root.istype111===2){
                    that.$message.success("您提交的店铺申请还在审核，请勿重复提交");
                }
                if (this.$root.istype111===-1){
                    that.$router.push("/recruit1");
                }
                if (this.$root.istype111===3){
                    that.$message.success("您提交的店铺申请审核已通过，欢迎加入菜菜帮！！！");
                }
                // if (this.$root.istype111===-1){
                //     that.$message.success("请先提交商家入驻申请");
                //     that.$router.push("/recruit");
                // }
            },
            searchJIangshi(){
                this.$emit("getCourseByCourseName",this.name)
                if(!this.name){
                    return;
                }else {
                    console.log('搜索内容',this.name);
                    //路由跳转并传递参数
                    this.$router.push({
                        path: `/goodslist/${this.name}`
                    });
                }
            },
            open1() {
                var that=this
                const h = this.$createElement;
                this.$notify({
                    title: '欢迎光临',
                    message: h('i', { style: 'color: blue'}, this.messages1)
                });
            },
            open2() {
                var that=this
                const h = this.$createElement;
                this.$notify({
                    title: '审核详情',
                    message: h('i', { style: 'color: teal'}, this.messages2)
                });
            },
            open3() {
                var that=this
                const h = this.$createElement;
                this.$notify({
                    title: '审核详情',
                    message: h('i', { style: 'color: red'}, "您提交的审核："+this.messages2)
                });
            },
            change () {
                this.interval = setInterval(() => {
                    if (this.num + 1 >= this.data.length) {
                        this.num = 0;
                    } else {
                        this.num++;
                    }
                }, 3000)
            },
            mout () {
                this.change();
            },
            mover () {
                clearInterval(this.interval);
            },
            //登录
            login(){
                this.$router.push("/qianLogin")
                this.$route.query.tab=1;
            },
            /*注册*/
            register(){
                this.$router.push("/qianLogin")
                this.$route.query.tab=2;
            },
            tuichu(){
                var that=this;
                this.$http.get("/user/user/loginOut").then(function (resp) {
                    if (resp.data.code===200){
                        localStorage.clear();//清空sessionStorage中的请求头
                        that.$router.push("/");
                        that.$router.go(0);
                  }
              })
            },
        },
    }
</script>
<style lang="scss" rel="stylesheet/scss" scoped>

    .h_header {
        background: #fff;
    }
    .h_top {
        background: rgb(51, 51, 51);
        .h_top_body {
            width: 1200px;
            height: 30px;
            margin: 0px auto;
        }
    }
    .top_list {
        float: right;
        li {
            list-style-type:none;
            float: left;
            color: #ccc;
            font-size: 12px;
            margin-top: 9px;
            padding: 0px 10px 0px 0px;
            position: relative;
            img {
                width: 14px;
                height: 13px;
                position: absolute;
                left: -20px;
            }
            .vip_icon {
                position: relative;
                left: 0;
                top: 1px;
                cursor: pointer;
            }
            a {
                color: #ccc;
                &:hover {
                    text-decoration: none;
                    color: #fff;
                }
                &.c_gold {
                    color: #CA9E70;
                }
            }
            &.s_left {
                border-left: 1px solid #ccc;
                padding-left: 10px;
            }
        }
    }
    .h_nav {
        width: 1200px;
        margin: 0 auto;
        height: 110px;
        position: relative;
        .go_index {
            position: absolute;
            right: 10px;
            bottom: 20px;
        }
    }
    .h_logo {
        display: inline-block;
        position: absolute;
        top: 25px;
        // left: 20px;
        img {
            height: 52px;
        }
    }
    .h_nav_ul {
        display: inline-block;
        margin-left: 100px;
        li {
            float: left;
            height: 110px;
            line-height: 110px;
            font-size: 16px;
            padding: 0 15px;
            .active {
                color: red;
            }
            a:hover {
                color: red;
                text-decoration: none;
            }
        }
    }
    .search_box  {
        float: right;
        width: 300px;
        background-color: #e2e2e2;
        border-radius: 8px;
    }

    .search_input{
        padding-left: 12px;
        color: #333;
        height: 30px;
        border: none;
        width: 243px;
        overflow: hidden;

        background-color: #e2e2e2;
        border-radius: 8px;
    }

</style>
